<template>
    <GeneralOperationForm
        :navLists="navLists"
    >
        <template #default>
            <div>
                <Section :list="navLists[0]" />
                <Section :list="navLists[1]" />
                <div class="content-box">
                    <div class="content-row-1">
                        <div class="content-row-title-1">类别:</div>
                        <div class="content-row-text-1">{{ formData1.orgName }}</div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">机构儿童类别:</div>
                        <div class="content-row-text-1">{{ formData1.type }}</div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">代养县级福利机构:</div>
                        <div class="content-row-text-1">{{ formData1.workWithMp }}</div>
                    </div>
                </div>
                
                <Section :list="navLists[2]" />
                <div class="content-box">
                    <div class="content-row-1">
                        <div class="content-row-title-1">姓名:</div>
                        <div class="content-row-text-1">{{ formData1.name }}</div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">身份证号:</div>
                        <div class="content-row-text-1">{{ formData1.id_number }}</div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">出生日期:</div>
                        <div class="content-row-text-1">{{ formData1.birthdate }}</div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">性别:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :dictionary="GENERAL_REMOTE_OPTIONS[8]"
                                :value="formData1.gender"
                            />
                        </div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">民族:</div>
                        <div class="content-row-text-1">{{ formData1.ethnicity }}</div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">工学情况:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :dictionary="GENERAL_REMOTE_OPTIONS[14]"
                                :value="formData1.education_or_job"
                            />
                        </div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">健康状况:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :dictionary="GENERAL_REMOTE_OPTIONS[11]"
                                :value="formData1.health_status"
                            />
                        </div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">患病类型:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :dictionary="GENERAL_REMOTE_OPTIONS[12]"
                                :value="formData1.disease_types"
                            />
                        </div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">残疾类型:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :dictionary="GENERAL_REMOTE_OPTIONS[0]"
                                :value="formData1.disabled_types"
                            />
                        </div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">残疾等级:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :dictionary="GENERAL_REMOTE_OPTIONS[13]"
                                :value="formData1.disabled_level"
                            />
                        </div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">养育模式:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :dictionary="GENERAL_REMOTE_OPTIONS[15]"
                                :value="formData1.parenting_type"
                            />
                        </div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">入院时间:</div>
                        <div class="content-row-text-1">{{ formData1.entry_date }}</div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">户口分类:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :dictionary="GENERAL_REMOTE_OPTIONS[10]"
                                :value="formData1.hukou_category"
                            />
                        </div>
                    </div>
                    <div class="content-row-2">
                        <div class="content-row-title-1">户籍地址:</div>
                        <div class="content-row-text-1">{{ formData1.hukou_address }}</div>
                    </div>
                    <div class="content-row-1">
                        <div class="content-row-title-1">现居地址:</div>
                        <div class="content-row-text-1">{{ formData1.address }}</div>
                    </div>
                </div>
                <Section :list="navLists[3]" />
                <div class="content-box">
                    <div class="content-row-1">
                        <div class="content-row-title-1">机构名称:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :dictionary="GENERAL_REMOTE_OPTIONS[6]"
                                :value="formData1.welfare_org_name"
                            />
                        </div>
                    </div>
                </div>
                <Section :list="navLists[4]" />
                <div class="content-box">
                    <div 
                        v-for="(item, index) in formData1.attachments"
                        :key="`attachments-${index}`"
                        class="content-row-1"
                    >
                        <FormUploadImage 
                            v-model:imageStr="item.attachmentName"
                            :title="item.attachmentTitle"
                            :showButton="false"
                        />
                    </div>
                </div>
                <Section :list="navLists[5]" />
                <Section :list="navLists[6]" />
                <div class="content-box">
                    <div class="content-row-1">
                        <div class="content-row-title-1">当前状况:</div>
                        <div class="content-row-text-1">
                            <GeneralOptionValue 
                                :dictionary="GENERAL_REMOTE_OPTIONS[17]"
                                :value="formData1.dangqianzhuangkuang"
                            />
                        </div>
                    </div>
                </div>
                <Section :list="navLists[7]" />
                <div class="content-box">
                    <div class="content-row-1">
                        <div class="content-row-title-1">服务建议:</div>
                        <div class="content-row-text-1">{{ formData1.fuwujianyi }}</div>
                    </div>
                </div>
                <Section :list="navLists[8]" />
                <div class="content-box">
                    <GeneralTabelList
                        v-model:tableObj="tableObj" 
                    />
                    <!-- <div class="content-row-1">
                        <div class="content-row-title-1">评估记录:</div>
                        <div class="content-row-text-1">{{ formData1.pinggujilu }}</div>
                    </div> -->
                </div>
            </div>
        </template>
        <template #footer>
            <el-button 
                type="primary"
                @click="print"
            >
                打印
            </el-button>
            <el-button 
                type="primary"
                @click="goDialogEdit"
            >
                修改
            </el-button>
        </template>
    </GeneralOperationForm>
</template>
  
<script lang="ts" setup>
    import { ref, reactive, markRaw, onBeforeMount, onMounted, onBeforeUnmount, nextTick, computed, watch } from 'vue'
    import type { Ref, Raw } from 'vue'
    import { useRoute, useRouter } from 'vue-router'
    import { storeToRefs } from 'pinia'
    import { useStore } from '@/store'
    import { ElMessage } from 'element-plus'
    import {
        Lock,
        User,
        Monitor,
        Phone,
        UploadFilled,
        View
    } from '@element-plus/icons-vue'
    import { 
        welfareorgsGetWelfareOrgsInfoApi,
    } from '@/apis'
    import { getGeneralOptionsLabel } from '@/utils'
    import GeneralOperationForm from '@/components/generalOperationForm/GeneralOperationForm.vue'
    import Section from '@/components/section/Section.vue'
    import AdministrativeDivisionsCascader from '@/components/administrativeDivisionsCascader/AdministrativeDivisionsCascader.vue'
    import FormUploadImage from '@/components/formUploadImage/FormUploadImage.vue'
    import GeneralSelect from '@/components/generalSelect/GeneralSelect.vue'
    import GeneralOptionValue from '@/components/generalOptionValue/GeneralOptionValue.vue'
    import GeneralTabelList from '@/components/generalTabel/components/generalTabelList/GeneralTabelList.vue'
    import InstitutionalChildListEdit from '@/views/childWelfareInstitutions/institutionalChildList/components/institutionalChildListEdit/InstitutionalChildListEdit.vue'
    import InstitutionalChildListEvaluationResultsView from '@/views/childWelfareInstitutions/institutionalChildList/components/institutionalChildListEvaluationResultsView/InstitutionalChildListEvaluationResultsView.vue'
    import GeneralPrint from '@/components/generalPrint/GeneralPrint.vue'

    

    import { GENERAL_REMOTE_OPTIONS } from '@/constants'

    const route = useRoute()
    const router = useRouter()
    const store = useStore()
    
    const dialogObj = defineModel<any>('dialogObj', {
        required: false,
        default: {}
    })
    const emits = defineEmits<{
        // (e: 'update:isCollapse', data: boolean): void,
        tabelSearch: [data?: any]
    }>()
    // 侧边栏
    const navLists:Ref<any[]> = ref([
        {
            text: '基本信息',
            id: 'nav-id-1',
            level: 1,
        },
        {
            text: '状态',
            id: 'nav-id-1-1',
            level: 2,
        },
        {
            text: '儿童基本信息',
            id: 'nav-id-1-2',
            level: 2,
        },
        {
            text: '所属区划信息',
            id: 'nav-id-1-3',
            level: 2,
        },
        {
            text: '附件',
            id: 'nav-id-1-4',
            level: 2,
        },
        {
            text: '四色管理',
            id: 'nav-id-2',
            level: 1,
        },
        {
            text: '当前状态',
            id: 'nav-id-2-1',
            level: 2,
        },
        {
            text: '服务建议',
            id: 'nav-id-2-2',
            level: 2,
        },
        {
            text: '评估记录',
            id: 'nav-id-2-3',
            level: 2,
        },
    ])

    const formData1: Ref<any> = ref({
        orgName: '',
        type: '',
        workWithMp: '',
        name: '',
        id_number: '',
        birthdate: '',
        gender: '',
        ethnicity: '',
        education_or_job: '',
        health_status: '',
        disease_types: '',
        disabled_types: '',
        disabled_level: '',
        parenting_type: '',
        entry_date: '',
        hukou_category: '',
        hukou_address: '',
        address: '',
        welfare_org_name: '',
        dangqianzhuangkuang: '',
        fuwujianyi: '',
        pinggujilu: '',
        attachments: [
            {
                attachmentName: '', //附件地址名称（多个中间用，分割）	
                attachmentTitle: '儿童照片', //附件名称 （例如：身份证正面、身份证反面、学位证书、毕业证书、机构附件）
                entitySubType: '', //附件子类型枚举
                entitySubTypeName: '', //附件子类型名称
                id: '',
            },
            {
                attachmentName: '', //附件地址名称（多个中间用，分割）	
                attachmentTitle: '代养协议', //附件名称 （例如：身份证正面、身份证反面、学位证书、毕业证书、机构附件）
                entitySubType: '', //附件子类型枚举
                entitySubTypeName: '', //附件子类型名称
                id: '',
            },
            {
                attachmentName: '', //附件地址名称（多个中间用，分割）	
                attachmentTitle: '入院体检报告', //附件名称 （例如：身份证正面、身份证反面、学位证书、毕业证书、机构附件）
                entitySubType: '', //附件子类型枚举
                entitySubTypeName: '', //附件子类型名称
                id: '',
            },
            {
                attachmentName: '', //附件地址名称（多个中间用，分割）	
                attachmentTitle: '社会保障卡', //附件名称 （例如：身份证正面、身份证反面、学位证书、毕业证书、机构附件）
                entitySubType: '', //附件子类型枚举
                entitySubTypeName: '', //附件子类型名称
                id: '',
            },
        ], //https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg,https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg
    })
    const tableObj: Ref<any> = ref({
        tableData: [
        ],
        tableColumn: [
            // {
            //     tableProp: '', //字段名称 对应列内容的字段名， 也可以使用 property属性
            //     tableLabel: '', //显示的标题
            //     // tableWidth: '100', //对应列的宽度
            //     tableMinWidth: '50', //对应列的最小宽度， 对应列的最小宽度， 与 width 的区别是 width 是固定的，min-width 会把剩余宽度按比例分配给设置了 min-width 的列
            //     tableShowOverflowTooltip: true, //当内容太长时，它会分成多行。您可以使用 show-overflow-tooltip 将其保留在一行中。属性 show-overflow-tooltip 接受一个布尔值。 为 true 时多余的内容会在 hover 时以 tooltip 的形式显示出来。
            //     tableFixed: false, //它接受 Boolean 值。 如果为 true, 列将被左侧固定. 它还接受传入字符串，left 或 right，表示左边固定还是右边固定。
            //     tableType: 'selection', //对应列的类型。 如果设置了selection则显示多选框； 如果设置了 index 则显示该行的索引（从 1 开始计算）； 如果设置了 expand 则显示为一个可展开的按钮
            //     tableAlign: 'left', //对齐方式'left' | 'center' | 'right'
            //     tableHeaderAlign: 'left', //表头对齐方式， 若不设置该项，则使用表格的对齐方式'left' | 'center' | 'right'
            //     tableChildren: [ //多级表头需要
            //     ],
            //     tableSortable: false, //在列中设置 sortable 属性即可实现以该列为基准的排序， 接受一个 Boolean，默认为 false。 可以通过 Table 的 default-sort 属性设置默认的排序列和排序顺序。
            // },
            {
                tableProp: '', //字段名称 对应列内容的字段名， 也可以使用 property属性
                tableLabel: '序号', //显示的标题
                // tableWidth: '100', //对应列的宽度
                tableMinWidth: '100', //对应列的最小宽度， 对应列的最小宽度， 与 width 的区别是 width 是固定的，min-width 会把剩余宽度按比例分配给设置了 min-width 的列
                tableShowOverflowTooltip: true, //当内容太长时，它会分成多行。您可以使用 show-overflow-tooltip 将其保留在一行中。属性 show-overflow-tooltip 接受一个布尔值。 为 true 时多余的内容会在 hover 时以 tooltip 的形式显示出来。
                tableFixed: false, //它接受 Boolean 值。 如果为 true, 列将被左侧固定. 它还接受传入字符串，left 或 right，表示左边固定还是右边固定。
                tableType: 'index', //对应列的类型。 如果设置了selection则显示多选框； 如果设置了 index 则显示该行的索引（从 1 开始计算）； 如果设置了 expand 则显示为一个可展开的按钮
                tableAlign: 'left', //对齐方式'left' | 'center' | 'right'
                tableHeaderAlign: 'left', //表头对齐方式， 若不设置该项，则使用表格的对齐方式'left' | 'center' | 'right'
                tableChildren: [ //多级表头需要
                   
                ],
                tableSortable: false, //在列中设置 sortable 属性即可实现以该列为基准的排序， 接受一个 Boolean，默认为 false。 可以通过 Table 的 default-sort 属性设置默认的排序列和排序顺序。
            },
            {
                tableProp: 'pingguriqi', //字段名称 对应列内容的字段名， 也可以使用 property属性
                tableLabel: '评估日期', //显示的标题
                // tableWidth: '100', //对应列的宽度
                tableMinWidth: '200', //对应列的最小宽度， 对应列的最小宽度， 与 width 的区别是 width 是固定的，min-width 会把剩余宽度按比例分配给设置了 min-width 的列
                tableShowOverflowTooltip: true, //当内容太长时，它会分成多行。您可以使用 show-overflow-tooltip 将其保留在一行中。属性 show-overflow-tooltip 接受一个布尔值。 为 true 时多余的内容会在 hover 时以 tooltip 的形式显示出来。
                tableFixed: false, //它接受 Boolean 值。 如果为 true, 列将被左侧固定. 它还接受传入字符串，left 或 right，表示左边固定还是右边固定。
                tableType: 'default', //对应列的类型。 如果设置了selection则显示多选框； 如果设置了 index 则显示该行的索引（从 1 开始计算）； 如果设置了 expand 则显示为一个可展开的按钮
                tableAlign: 'left', //对齐方式'left' | 'center' | 'right'
                tableHeaderAlign: 'left', //表头对齐方式， 若不设置该项，则使用表格的对齐方式'left' | 'center' | 'right'
                tableChildren: [ //多级表头需要
                ],
                tableSortable: false, //在列中设置 sortable 属性即可实现以该列为基准的排序， 接受一个 Boolean，默认为 false。 可以通过 Table 的 default-sort 属性设置默认的排序列和排序顺序。
            },
            {
                tableProp: 'pingguren', //字段名称 对应列内容的字段名， 也可以使用 property属性
                tableLabel: '评估人', //显示的标题
                // tableWidth: '100', //对应列的宽度
                tableMinWidth: '200', //对应列的最小宽度， 对应列的最小宽度， 与 width 的区别是 width 是固定的，min-width 会把剩余宽度按比例分配给设置了 min-width 的列
                tableShowOverflowTooltip: true, //当内容太长时，它会分成多行。您可以使用 show-overflow-tooltip 将其保留在一行中。属性 show-overflow-tooltip 接受一个布尔值。 为 true 时多余的内容会在 hover 时以 tooltip 的形式显示出来。
                tableFixed: false, //它接受 Boolean 值。 如果为 true, 列将被左侧固定. 它还接受传入字符串，left 或 right，表示左边固定还是右边固定。
                tableType: 'default', //对应列的类型。 如果设置了selection则显示多选框； 如果设置了 index 则显示该行的索引（从 1 开始计算）； 如果设置了 expand 则显示为一个可展开的按钮
                tableAlign: 'left', //对齐方式'left' | 'center' | 'right'
                tableHeaderAlign: 'left', //表头对齐方式， 若不设置该项，则使用表格的对齐方式'left' | 'center' | 'right'
                tableChildren: [ //多级表头需要
                ],
                tableSortable: false, //在列中设置 sortable 属性即可实现以该列为基准的排序， 接受一个 Boolean，默认为 false。 可以通过 Table 的 default-sort 属性设置默认的排序列和排序顺序。
            },
            {
                tableProp: 'fengxiandengji', //字段名称 对应列内容的字段名， 也可以使用 property属性
                tableLabel: '风险等级', //显示的标题
                // tableWidth: '100', //对应列的宽度
                tableMinWidth: '200', //对应列的最小宽度， 对应列的最小宽度， 与 width 的区别是 width 是固定的，min-width 会把剩余宽度按比例分配给设置了 min-width 的列
                tableShowOverflowTooltip: true, //当内容太长时，它会分成多行。您可以使用 show-overflow-tooltip 将其保留在一行中。属性 show-overflow-tooltip 接受一个布尔值。 为 true 时多余的内容会在 hover 时以 tooltip 的形式显示出来。
                tableFixed: false, //它接受 Boolean 值。 如果为 true, 列将被左侧固定. 它还接受传入字符串，left 或 right，表示左边固定还是右边固定。
                tableType: 'default', //对应列的类型。 如果设置了selection则显示多选框； 如果设置了 index 则显示该行的索引（从 1 开始计算）； 如果设置了 expand 则显示为一个可展开的按钮
                tableAlign: 'left', //对齐方式'left' | 'center' | 'right'
                tableHeaderAlign: 'left', //表头对齐方式， 若不设置该项，则使用表格的对齐方式'left' | 'center' | 'right'
                tableChildren: [ //多级表头需要
                ],
                tableSortable: false, //在列中设置 sortable 属性即可实现以该列为基准的排序， 接受一个 Boolean，默认为 false。 可以通过 Table 的 default-sort 属性设置默认的排序列和排序顺序。
            },
            {
                tableProp: 'zhuanseqingkuang', //字段名称 对应列内容的字段名， 也可以使用 property属性
                tableLabel: '转色情况', //显示的标题
                // tableWidth: '100', //对应列的宽度
                tableMinWidth: '200', //对应列的最小宽度， 对应列的最小宽度， 与 width 的区别是 width 是固定的，min-width 会把剩余宽度按比例分配给设置了 min-width 的列
                tableShowOverflowTooltip: true, //当内容太长时，它会分成多行。您可以使用 show-overflow-tooltip 将其保留在一行中。属性 show-overflow-tooltip 接受一个布尔值。 为 true 时多余的内容会在 hover 时以 tooltip 的形式显示出来。
                tableFixed: false, //它接受 Boolean 值。 如果为 true, 列将被左侧固定. 它还接受传入字符串，left 或 right，表示左边固定还是右边固定。
                tableType: 'default', //对应列的类型。 如果设置了selection则显示多选框； 如果设置了 index 则显示该行的索引（从 1 开始计算）； 如果设置了 expand 则显示为一个可展开的按钮
                tableAlign: 'left', //对齐方式'left' | 'center' | 'right'
                tableHeaderAlign: 'left', //表头对齐方式， 若不设置该项，则使用表格的对齐方式'left' | 'center' | 'right'
                tableChildren: [ //多级表头需要
                ],
                tableSortable: false, //在列中设置 sortable 属性即可实现以该列为基准的排序， 接受一个 Boolean，默认为 false。 可以通过 Table 的 default-sort 属性设置默认的排序列和排序顺序。
            },
            {
                tableProp: '', //字段名称 对应列内容的字段名， 也可以使用 property属性
                tableLabel: '操作', //显示的标题
                // tableWidth: '100', //对应列的宽度
                tableMinWidth: '300', //对应列的最小宽度， 对应列的最小宽度， 与 width 的区别是 width 是固定的，min-width 会把剩余宽度按比例分配给设置了 min-width 的列
                tableShowOverflowTooltip: true, //当内容太长时，它会分成多行。您可以使用 show-overflow-tooltip 将其保留在一行中。属性 show-overflow-tooltip 接受一个布尔值。 为 true 时多余的内容会在 hover 时以 tooltip 的形式显示出来。
                tableFixed: 'right', //它接受 Boolean 值。 如果为 true, 列将被左侧固定. 它还接受传入字符串，left 或 right，表示左边固定还是右边固定。
                tableType: 'default', //对应列的类型。 如果设置了selection则显示多选框； 如果设置了 index 则显示该行的索引（从 1 开始计算）； 如果设置了 expand 则显示为一个可展开的按钮
                tableAlign: 'left', //对齐方式'left' | 'center' | 'right'
                tableHeaderAlign: 'left', //表头对齐方式， 若不设置该项，则使用表格的对齐方式'left' | 'center' | 'right'
                tableChildren: [ //多级表头需要
                   
                ],
                tableSortable: false, //在列中设置 sortable 属性即可实现以该列为基准的排序， 接受一个 Boolean，默认为 false。 可以通过 Table 的 default-sort 属性设置默认的排序列和排序顺序。
                tableContentType: 'button', //column定制内容类型
                tableContentButtons: [ // //column定制按钮
                    {
                        tableContentButtonType: 'primary', //按钮类型
                        tableContentButtonPlain: false, //是否为朴素按钮
                        tableContentButtonRound: false, //是否为圆角按钮
                        tableContentButtonCircle: false, //是否为圆形按钮
                        tableContentButtonIcon: View, //图标组件
                        tableContentButtonDisabled: false, //按钮是否为禁用状态
                        tableContentButtonText: false, //是否为文字按钮
                        tableContentButtonLink: false, //是否为链接按钮
                        tableContentButtonBg: false, //是否显示文字按钮背景颜色
                        tableContentButtonLoading: false, //是否为加载中状态
                        tableContentButtonLoadingIcon: '', //自定义加载中状态图标组件
                        tableContentButtonColor: '', //自定义按钮颜色, 并自动计算 hover 和 active 触发后的颜色	
                        tableContentButtonDark: '', //dark 模式, 意味着自动设置 color 为 dark 模式的颜色
                        tableContentButtonMainText: '查看评估结果', //按钮文字
                        tableContentButtonClick: (val) => {
                            // dialogObj.value.dialogVisible = true
                            dialogObj.value.dialogComponent = InstitutionalChildListEvaluationResultsView
                            dialogObj.value.dialogParams = {
                                id: val.row.id
                            }
                            dialogObj.value.dialogTitle = '查看评估结果'
                        }
                    },
                ],
            },
        ],
        tableBorder: true, //是否带有纵向边框
        tableStripe: true, //是否为斑马纹 table
        tableRowClassName: ({ //自定义每一行的样式
            row,
            rowIndex,
        }) => {
            // if (rowIndex === 1) {
            //     return 'warning-row'
            // } else if (rowIndex === 3) {
            //     return 'success-row'
            // }
            return ''
        },
        // tableHeight: '500', //已经通过样式设置了flex=1，高度不用再设置  table 的高度。 默认为自动高度。 如果 height 为 number 类型，单位 px；如果 height 为 string 类型，则这个高度会设置为 Table 的 style.height 的值，Table 的高度会受控于外部样式。
        // tableMaxHeight: '500', //已经通过样式设置了flex=1，高度不用再设置  table 的最大高度。 合法的值为数字或者单位为 px 的高度。
        tableHighlightCurrentRow: false, //是否要高亮当前行
        tableFit: true, //列的宽度是否自撑开
        tableShowHeader: true, //是否显示表头
        tableCurrentChange: (currentRow, oldCurrentRow) => { //当表格的当前行发生变化的时候会触发该事件，如果要高亮当前行，请打开表格的 highlight-current-row 属性
            // console.log(currentRow)
            // console.log(oldCurrentRow)
        },
        tableRowDblclick: (row , column, event) => { //当某一行被双击时会触发该事件
            // console.log(row)
            // console.log(column)
            // console.log(event)
        },
        // tableDefaultSort: '', //默认的排序列的 prop 和顺序。 它的 prop 属性指定默认的排序的列，order 指定默认排序的顺序，例子{ prop: 'date', order: 'descending' }
        tableFormatter: (row, column) => { //它用于格式化指定列的值
            // return row.address
        },
        tableRowKey: '', //行数据的 Key，用来优化 Table 的渲染； 在使用reserve-selection功能与显示树形数据时，该属性是必填的。 类型为 String 时，支持多层访问：user.info.id，但不支持 user.info[0].id，此种情况请使用 Function。
        tableDefaultExpandAll: false, //是否默认展开所有行，当 Table 包含展开行存在或者为树形表格时有效
        tableShowSummary: false, //是否在表尾显示合计行
        tableLayout: 'fixed', //设置表格单元、行和列的布局方式
        tableSelection: [], //选择项的值
        tableSelectionChange: (newSelection) => { //当选择项发生变化时会触发该事件
            tableObj.value.tableSelection = newSelection
            // console.log(tableObj.value.tableSelection)
        },
    })
  
    onMounted(async() => {
        // if (dialogObj.value?.dialogParams.id) {
            try {
                let res1:any = await welfareorgsGetWelfareOrgsInfoApi({
                    id: dialogObj.value.dialogParams?.id ? dialogObj.value.dialogParams?.id : ''
                })
                formData1.value = res1.data
                // tableObj.value.tableData = []
            } catch(err) {

            }
        // }
    })

    const print = () => {
        dialogObj.value.dialogVisible = true
        dialogObj.value.dialogTitle = '打印'
        dialogObj.value.dialogComponent = GeneralPrint
    }
    const goDialogEdit = () => {
        dialogObj.value.dialogComponent = InstitutionalChildListEdit
        dialogObj.value.dialogTitle = '修改'
    }

    
</script>
  
<style lang="scss" scoped>
    .content-box {
        @include general-view-1;
        .content-row-1 {
            @include general-view-row-1;
            .content-row-title-1 {
                @include general-view-row-title-1;
            }
            .content-row-text-1 {
                @include general-view-row-text-1;
            }
        }
        .content-row-2 {
            @include general-view-row-2;
            .content-row-title-1 {
                @include general-view-row-title-1;
            }
            .content-row-text-1 {
                @include general-view-row-text-1;
            }
        }
    }
</style>
